<template>
	<view>
		<view class="cu-form-group">
			<view class="title">{{labelName}}</text></view>
			<input type='text' v-show="false" v-model='modelValue' :name='path' >
		</view>
		<checkbox-group class="block" @change="CheckboxChange">
			<view class="cu-form-group" v-for="(val,ind) in picker">
				<view class="title">{{val.name}}</view>
				<checkbox :class="val.checked?'checked':''" :checked="val.checked" :value="val.value"></checkbox>
			</view>
		</checkbox-group>
	</view>
</template>

<script>
	import moment from 'moment'
	import {mapActions} from 'vuex'
	// input输入绑定
	// input:number绑定
	// input:number小数限制两位
	// 日期时间选择控件
	export default {
		name: 'js-input',
		behaviors: ['uni://form-field-group'],
		data() {
			return {
				index: -1,
				picker: [],
				modelValue: ''
			}
		},
		computed:{
		},
		props: {
			labelName: {
				type: String,
				default: ''
			},
			path: {
				type: String,
				default: ''
			},
			value:{
				type: String,
				default: ''
			},
			dictType:{
				type: String,
				default: ''
			}
		},
		mounted() {
			// 获取字典值
			this.getDictData()
		},
		methods:{
			...mapActions(['getDict']),
			async CheckboxChange(e) {
				this.modelValue = e.detail.value.join(",")
				let result = await this.getDict({dictType: this.dictType})
				if(this.modelValue){
					let valueList = this.modelValue.split(",")
					result.forEach((v, k)=>{
						if(valueList.indexOf(v.value) != -1){
							this.$set(this.picker[k], "checked", true)
						} else {
							this.$set(this.picker[k], "checked", false)
						}
					})
				}
			},
			async getDictData(){
				let result = await this.getDict({dictType: this.dictType})
				this.picker = result
				if(this.value){
					let valueList = this.value.split(",")
					result.forEach((v, k)=>{
						if(valueList.indexOf(v.value) != -1){
							this.$set(this.picker[k], "checked", true)
						}
					})
					this.modelValue = this.value
				}
			}
		}
	}
</script>

<style>
	.cu-form-group{
		border-top:null;
		border-bottom:1rpx solid #eee;
	}
</style>
